doctype html
html
  head
    link href = "/css/bootstrap.css" rel = "stylesheet"
    link href = "/css/app.css" rel = "stylesheet"
    link href = "/css/bootstrap-editable.css" rel = "stylesheet"
    link href = "/css/jquery.emojiarea.css" rel = "stylesheet"
    title chat-websocket
  body
    <a target="_blank" href="https://github.com/kikyous/websocket_chat"><img style="position: absolute; top: 0; right: 0; border: 0;" src="https://s3.amazonaws.com/github/ribbons/forkme_right_orange_ff7600.png" alt="Fork me on GitHub"></a>
    .navbar.navbar-inverse
      .navbar-inner
        .container
          .brand
            a href='/' WebsocketChat
          ul class="nav" role="navigation"
            li class="dropdown"
              a id="drop1" href="#" role="button" class="dropdown-toggle" data-toggle="dropdown"
                | Channels
                b class="caret"
              ul class="dropdown-menu" role="menu" aria-labelledby="drop1"
                li role="presentation"
                  a role="menuitem" tabindex="-1" href="/channel" All channels
                li role="presentation" class="divider"
                li role="presentation"
                  a role="menuitem" tabindex="-1" href="/channel/#{SecureRandom.hex}" New channel
                li role="presentation"
                  a role="menuitem" tabindex="-1" href="/channel/_#{SecureRandom.hex}" New private channel
    script src = "/js/jquery-1.7.2.min.js"
    .container
      == yield
    script src = "/js/bootstrap.min.js"
    script src = "/js/bootstrap-editable.min.js"
    script src = "/js/jquery.emojiarea.js"
    script src = "/js/moment.min.js"
    script src = "/emoji/emojis.js"
